<template>
    
  <div>
    
    <van-nav-bar
  title="购物车"
  left-text="返回"
  
  left-arrow
  @click-left="onClickLeft"
  @click-right="onClickRight"
/>
<div class="card">
    <div class="shop">
        <img src="https://static.asus.com.cn/static/wap/app/images/cart/image_car_nil.png" alt="">
    </div>
    <div class="pp">您的购物车木有商品</div>
    <div class="wen">
        <span class="zi">去购物</span>
    </div>
</div>

  </div>
</template>

<script>
export default {
    methods: {
    onClickLeft() {
     
    },
    onClickRight() {
      
    },
  },

}
</script>

<style scoped>
body{
   background-color: #eee;
}
.card{
    height: 23.4375rem;
   
}
.card .shop{
    height: 5.1875rem;
   margin-top: 4rem;
  
    text-align: center;
    padding: 2.5rem 0;

}
.card .shop img{
    width: 10.5625rem;
    height: 5.1875rem;
    
}

.card .pp{
    text-align: center;
    color: #eee;

}
.card .wen{
 height: 35px;
 
 text-align: center;

 margin: 20px 0;
 line-height: 35px;
 
   
}
.card .wen .zi{

  
    width: 6.4375rem;
    height: 2.1875rem;
    border-radius: 10px;
   color: #0057B7;
   border: 1px solid #0057B7;
  
  
    font-size: 26px;
   
}
</style>